<script setup lang="ts">
  import { reactive,provide } from 'vue';
  import {myStore} from '@/store/my'
  import EducationalExperiencePopup from './EducationalExperiencePopup.vue'
  const store:any = myStore()
  const state:any = reactive({
    show: false,
    item: {}
  })
  const props = defineProps({
    eduEx: {
      type: Object
    }
  })
  const closeChange = () => {
    state.show = false
    store.getResumeDetail()
  }
  const editWork = () => {
    state.show = true
  }
  provide('popup',{
    closeChange
  })
</script>
<template>
    <div class="resume-label">
        <h3>教育经历<van-icon @click="editWork" name="add-o" /></h3>
        <div v-if="props.eduEx">
            <h4>{{props.eduEx.schoolName}}</h4>
            <h4>{{props.eduEx.education}}</h4>
            <p>{{props.eduEx.startTime}} - {{props.eduEx.endTime}}</p>
            <h5>{{props.eduEx.major}}</h5>
        </div>
        <label v-else>请您填写教育经历</label>
        <!--弹窗-->
        <van-popup v-model:show="state.show" position="top" duration="0" :style="{ width: '100%',height: '100%' }">
          <EducationalExperiencePopup :eduEx="props.eduEx"></EducationalExperiencePopup>
        </van-popup>
    </div>
</template>
<style scoped>
.text-list dt{
    font-size: 0.59rem;
    line-height: 0.59rem;
    font-weight: 300;
    color: #666666;
    padding: 0.4rem 0.5rem;
    margin-right: 0.27rem;
    margin-bottom: 0.3rem;
    background: #F6F7F8;
    border-radius: 0.16rem;
    display: inline-block;
}
</style>